<template>
	<view class="goods-card" v-if="state">
		<van-swipe-cell right-width="65" left-width="65">
			<view slot="left" @click="edit" class="left">编辑</view>

			<view class="card">
				<van-card
				  class="goods"
				  num="件"
				  tag=" "
				  currency=" "
				  :price="carbon"
				  :desc="desc"
				  :title="title"
				  :thumb="imageURL"
				  :pid="pid"
				  :category="category"
				  :fullName="fullName"
				/>
				
			</view>
			

			<view slot="right" @click="del(gid)" class="right">删除</view>
		</van-swipe-cell>
	</view>
</template>

<script>
	import { delGoods as delGoodsApi } from '@/api/goods'
	
	export default {
		props: {
			pid: {
				type: String,
				default: () => {}
			},
			category: {
				type: String,
				default: () => {}
			},
			gid: {
				type: Number,
				default: () => {}
			},
			imageURL: {
				type: String,
				default: () => {}
			},
			price: {
				type: Number,
				default: 0
			},
			title: {
				type: String,
				default: () => {}
			},
			desc: {
				type: String,
				default: () => {}
			},
			fullName: {
				type: String,
				default: () => {}
			}
		},
		data() {
			return {
				carbon: this.price,
				state: true
			}
		},
		methods: {
			edit() {
				// console.log('edit')
				uni.navigateTo({
					url: '../../pages/add-product/add-product?gid='+this.gid
				})
				
			},
			async del(gid) {
				// console.log('del')
				const data = {
					gid: this.gid
				}
				
				const res = await delGoodsApi(data)
				if(res.status === this.API_STATUS_CODE.SUCCESS) {
					this.state = false
					uni.showToast({
						icon: 'none',
						title: '删除成功',
						duration: 3000
					})
				}else {
					uni.showToast({
						icon: 'none',
						title: '删除失败，请刷新重试',
						duration: 3000
					})
				}
				// this.reload()
				// console.log(res)
			}

		}
	}
</script>

<style lang="less" scoped>
	.goods-card {
		width: 100%;
		margin-top: 20rpx;
		
		.left {
			background-color: #07c160;
			width: 130rpx;
			height: 100%;
			text-align: center;
			line-height: 200rpx;
			color: white;
		}

		.right {
			background-color: #ee0a24;
			width: 130rpx;
			height: 100%;
			text-align: center;
			line-height: 200rpx;
			color: white;
		}
		
		.card {
			height: 200rpx;
			// background-color: pink;
			
			.goods {
				background-color: rgba(255,255,255,.1)!important;
			}
		}
		
	}
</style>
